﻿<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;
var fileSystemURL;
//创建图片
function createImg(){  
    window.requestFileSystem(           
        PERSISTENT, 
        1024,  
        //请求文件系统成功时所执行的回调函数
        function(fs){
            var filename =document.getElementById("fileName").value; 
            //获取文件对象             
            fs.root.getFile(filename, 
                {create:false},
                //获取文件成功时所执行的回调函数
                function(fileEntry) {                     
                    var img = document.createElement('img');
                    fileSystemURL=fileEntry.toURL(); 
                    img.src = fileSystemURL; 
                    document.getElementById("form1").appendChild(img);
                    document.getElementById("btnGetFile").disabled=false;
                }, 
                //获取文件失败时所执行的回调函数
                errorHandler);          
        },    
        //请求文件系统失败时所执行的回调函数       
        errorHandler        
    );
}
function getFile(){
    window.resolveLocalFileSystemURL = window.resolveLocalFileSystemURL ||window.webkitResolveLocalFileSystemURL;
    window.resolveLocalFileSystemURL(fileSystemURL, 
        //获取文件对象成功时执行的回调函数
        function(fileEntry) {
            document.getElementById("result").innerHTML="文件名为:"+fileEntry.name;
        },
        //获取文件对象失败时执行的回调函数
        errorHandler
    );
}
function errorHandler(e) {
    switch (e.code) {
        case FileError.QUOTA_EXCEEDED_ERR:
            console.log('文件系统所使用的存储空间的尺寸超过磁盘限额控制中指定的空间尺寸');
            break;
        case FileError.NOT_FOUND_ERR:
            console.log('未找到文件或目录');
            break;
        case FileError.SECURITY_ERR:
            console.log( '操作不当引起安全性错误');
            break;
        case FileError.INVALID_MODIFICATION_ERR:
            console.log('对文件或目录所指定的操作不能被执行');
            break;
        case FileError.INVALID_STATE_ERR:
            console.log('指定的状态无效');
    };
}

</script>
</head>
<body>
<h1>使用filesystem前缀的URL</h1>     
<form id="form1">
<input type="text" id="fileName">          
<input type="button" id="btnCreateImg" value="创建图片" onclick="createImg()">     
<input type="button" id="btnGetFile" value="显示文件名" onclick="getFile()"  disabled><br/>  
</form>     
<output id="result" ></output>
</body>
</html> 
